<script type="text/javascript">
var settingGroup = {
		check: {
			enable: true,
			chkboxType: {"Y":"", "N":""}
		},
		view: {
			dblClickExpand: false
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			beforeClick: beforeClickGroup,
			onCheck: onCheckGroup
		}
	};
	
	var zNodesGroup =[
	    <volist name="groupList" id="k">
	    	{id:"<php>echo $k['id'];</php>",pId:0,name:"<php>echo $k['title'];</php>"},
	    </volist>
	 ];
	
	function beforeClickGroup(treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeGroup");
		zTree.checkNode(treeNode, !treeNode.checked, null, true);
		return false;
	}
	
	function onCheckGroup(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeGroup"),
		nodes = zTree.getCheckedNodes(true),
		v = "";
		k = "";
		for (var i=0, l=nodes.length; i<l; i++) {
			v += nodes[i].name + ",";
			k += nodes[i].id + ",";
		}
		if (v.length > 0 ) v = v.substring(0, v.length-1);
		if (k.length > 0 ) k = k.substring(0, k.length-1);
		
		$("#citySelGroup").attr("value", v);
		$("#groupValue").val(k);
	}

	function showGroup() {
		var cityObj = $("#citySelGroup");
		var cityOffset = $("#citySelGroup").offset();
		$("#groupContent").css({left:cityOffset.left + "px", top:cityOffset.top + cityObj.outerHeight() + "px"}).slideDown("fast");

		$("body").bind("mousedown", onBodyDownGroup);
	}
	function hideMenuGroup() {
		$("#groupContent").fadeOut("fast");
		$("body").unbind("mousedown", onBodyDownGroup);
	}
	function onBodyDownGroup(event) {
		if (!(event.target.id == "menuBtnGroup" || event.target.id == "citySelGroup" || event.target.id == "groupContent" || $(event.target).parents("#groupContent").length>0)) {
			hideMenuGroup();
		}
	}

	$(document).ready(function(){
		$.fn.zTree.init($("#treeGroup"), settingGroup, zNodesGroup);
	});
</script>